dojo.require("dijit._Widget");
dojo.require("dijit._Templated");
dojo.require("dojo.fx");
dojo.require("dojox.timing");
dojo.require("chally.widgets.arrow");
dojo.provide("chally.widgets.rotatingdiv");

dojo.declare("chally.widgets.rotatingdiv", [dijit._Widget, dijit._Templated], {
    // Initialization parameters
    templatePath: dojo.moduleUrl("chally", "templates/widgets/RotatingDiv.html"),
    timer: null,
    currentIndex: 0,
    colors: ["red","blue","green","#dddddd","black"],
	
	constructor: function(params, srcNodeRef){
        console.log("creating widget with params " + dojo.toJson(params) + " on node " + srcNodeRef);
	},
	
	postCreate: function(){
		this.fadeArrows(null);
		timer = new dojox.timing.Timer(15000);
		timer.onTick = dojo.hitch(this,"iterateRight");
		timer.start();
		
		console.log(this.ArrowLeft);
		console.log(this.ArrowRight);
		
		dojo.connect(this.ArrowLeft, "onclick", this, "iterateLeft");
		dojo.connect(this.ArrowRight, "onclick", this, "iterateRight");
		
		dojo.connect(this.domNode, "onmouseleave", this, "fadeArrows");
		dojo.connect(this.domNode, "onmouseover", this, "restoreArrows");
	},
	
	iterateLeft: function(event){
		try{
			if(this.currentIndex == 0) { this.currentIndex = this.colors.length-1; }
			else { this.currentIndex--; }
			this.RotatingDivTop.style.backgroundColor = this.colors[this.currentIndex];
		}catch(e){alert(e);}
	},
	
	iterateRight: function(event){
		try{
			if(this.currentIndex == this.colors.length) { this.currentIndex = 0; }
			else { this.currentIndex++; }
			this.RotatingDivTop.style.backgroundColor = this.colors[this.currentIndex];
		}catch(e){alert(e);}
	},
	
	fadeArrows: function(event) {
		var right =  dojo.fadeOut({node:this.ArrowRight});
        var left = dojo.fadeOut({node:this.ArrowLeft});
        var fades = dojo.fx.combine([right, left]);
        fades.play();
	},
	
	restoreArrows: function(event) {
		var right =  dojo.fadeIn({node:this.ArrowRight});
        var left = dojo.fadeIn({node:this.ArrowLeft});
        var fades = dojo.fx.combine([right, left]);
        fades.play();
	},
	
	playAnimation: function(event) {
		
	}
});